<template>
  <div style="background: #ffffff; padding: 20px; box-sizing: border-box">
    <a-row>
      <a-col :span="24" style="margin-bottom: 20px;">
        <a-select default-value="地块名称" style="width: 200px;margin-right: 20px;">
          <a-select-option value="lucy">设备名称</a-select-option>
          <a-select-option value="jack">2</a-select-option>
        </a-select>
        <a-button type="primary" style="background: #3C67F1;border: none;">查询</a-button>
      </a-col>
      <a-col :span="24">
        <a-table :columns="columns" :data-source="data" bordered></a-table>
      </a-col>
    </a-row>
  </div>
</template>

<script>
  const columns = [
    {
      title: '序号',
      key: 'name',
      scopedSlots: {customRender: 'name'}
    },
    {
      title: '地块名称',
    },
    {
      title: '管道名称',
      ellipsis: true
    },
    {
      title: '管径',
      ellipsis: true
    },
    {
      title: '压力',
      ellipsis: true
    },
    {
      title: '阀值范围',
      ellipsis: true
    },
    {
      title: '预警状态',
      ellipsis: true
    }
    ,
    {
      title: '监测时间',
      ellipsis: true
    }
  ]

  const data = []
  export default {
    data() {
      return {
        data,
        columns
      }
    }
  }
</script>